<script setup lang="ts">
import {ref} from "vue";
import  { RuleGroupApi,type RuleGroupVO} from "./api";
import type {FormInstance} from "element-plus";

const emits = defineEmits<{
  (e:'ok')
}>();
const show=ref(false)
const formData =ref<RuleGroupVO>({})
const form=ref<FormInstance>()
const openForm=(b:boolean,f?:RuleGroupVO)=>{
  show.value=b
  formData.value=f||{}
}
const save=async ()=>{
  const b = await form.value?.validate();
  if (b){
    if (formData.value.id){
      await RuleGroupApi.updateRuleGroup(formData.value)
    }else {
      await RuleGroupApi.createRuleGroup(formData.value)
    }
    emits('ok')
    openForm(false)
  }
}
defineExpose({
  openForm
})
</script>

<template>
  <el-dialog v-model="show" title="编辑分组">
    <el-form :model="formData" ref="form" label-width="100px">
      <el-form-item prop="name" label="分组名称" required>
        <el-input v-model="formData.name"/>
      </el-form-item>
      <el-form-item prop="version" label="版本号" required>
        <el-input-number v-model="formData.version"/>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="save" type="primary">保存</el-button>
    </template>
  </el-dialog>
</template>

<style scoped lang="scss">

</style>
